<script setup lang="ts">
import { ref } from 'vue'

const list = ref(['西瓜', '苹果', '鸭梨', '榴莲'])
const goodslist = [
  { name: '苹果', price: 5 },
  { name: '香蕉', price: 3 },
  { name: '鸭梨', price: 2 },
  { name: '榴莲', price: 8 }
]
</script>

<template>
  <div id="app">
    <h3>小黑水果店</h3>
    <ul>
      <li v-for="(item, index) in list" :key="index">序号:{{ index + 1 }}---名称{{ item }}</li>
    </ul>
    <li v-for="item in list" :key="item">名称:{{ item }}</li>
    <ul></ul>
    <li v-for="item in goodslist" :key="item.price">{{ item.name }}</li>
  </div>
</template>

<style></style>
